-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Format library: fix unsetting highlight color #37062
Conversation
Size Change: +91 B (0%) Total Size: 1.11 MB
ℹ️ View Unchanged
|
713fc36
to
f134ea8
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This fixes the issue
but I don't really understand why this fix is that low level (in the CSS parsing) instead of when the color is cleared (remove the format)
@@ -17,6 +17,8 @@ import { removeFormat } from '@wordpress/rich-text'; | |||
*/ | |||
import { default as InlineColorUI, getActiveColors } from './inline'; | |||
|
|||
export const transparentValue = 'rgba(0, 0, 0, 0)'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I pushed a commit replacing all remaining occurrences of this string in format-library
with the new constant. This should decrease the chances of format mismatches creeping in — for example, if the setter uses a hardcoded string like rgba(0,0,0,0)
(with no spaces), the logic breaks.
The module constant, coupled with the expanded test coverage, might be enough. Otherwise we could use a regular expression.
const match = name.match( /^has-([^-]+)-color$/ ); | ||
if ( match ) { | ||
const [ , colorSlug ] = name.match( /^has-([^-]+)-color$/ ); | ||
if ( name.startsWith( 'has-' ) && name.endsWith( '-color' ) ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There should be a comment here explaining that colorSlug
may be more than one word long, lest someone reintroduce a naive regular expression.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Secondly, for named colors, we mistakenly don't take into account color slugs with dashes, so they never become active, and they cannot be unset. This PR also fixes that.
Do we have such slugs in our E2E environment? Could we test the scenario?
Regardless, LGTM!
It's not a general parsing CSS function, it's one specifically to parse the color from the style attribute. We have a similar function to parse the color from a class attribute.
We did implicitly. I made that explicit now. |
Description
Fixes #36532. If a transparent background color is set, it should be considered as no background set so that the format is removed when neither color not background color is set.
Secondly, for named colors, we mistakenly don't take into account color slugs with dashes, so they never become active, and they cannot be unset. This PR also fixes that.
How has this been tested?
Screenshots
Types of changes
Checklist:
*.native.js
files for terms that need renaming or removal).